// API 基础地址
const apiUrl = "http://localhost:8083/api/teacher/unit";  // 后端接口地址，替换为实际的地址

// 页面加载时获取数据
document.addEventListener("DOMContentLoaded", function () {
  loadTeachingClassData();
  loadLearningUnitData();
  loadStudentProgressData();
});

// 加载教学班数据
function loadTeachingClassData() {
  fetch(`${apiUrl}/list`, {  // 获取教学班数据
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({
      pageNum: 1,  // 当前页码
      pageSize: 10  // 每页数据量
    })
  })
  .then(response => response.json())
  .then(data => {
    if (data.code === 200) {
      renderTeachingClassData(data.data.records);  // 渲染教学班数据
    } else {
      alert('加载教学班数据失败');
    }
  })
  .catch(error => {
    console.error('Error fetching teaching class data:', error);
    alert('加载教学班数据失败');
  });
}

// 渲染教学班数据到表格
function renderTeachingClassData(teachingClasses) {
  const tbody = document.getElementById('teaching-class-table').getElementsByTagName('tbody')[0];
  tbody.innerHTML = '';  // 清空表格内容
  teachingClasses.forEach(classData => {
    const row = tbody.insertRow();
    row.innerHTML = `
      <td>${classData.name}</td>
      <td>${classData.description}</td>
      <td><button onclick="viewClassActivities(${classData.id})">查看活动</button></td>
      <td><button onclick="editClass(${classData.id})">编辑</button>  <button onclick="manageClassStudents(${classData.id})">管理学生</button></td>
    `;
  });
}

// 加载学习单元数据
function loadLearningUnitData() {
  fetch(`${apiUrl}/list`, {  // 获取学习单元数据
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({
      pageNum: 1,
      pageSize: 10
    })
  })
  .then(response => response.json())
  .then(data => {
    if (data.code === 200) {
      renderLearningUnitData(data.data.records);  // 渲染学习单元数据
    } else {
      alert('加载学习单元数据失败');
    }
  })
  .catch(error => {
    console.error('Error fetching learning unit data:', error);
    alert('加载学习单元数据失败');
  });
}

// 渲染学习单元数据到表格
function renderLearningUnitData(learningUnits) {
  const tbody = document.getElementById('learning-units-table').getElementsByTagName('tbody')[0];
  tbody.innerHTML = '';  // 清空表格内容
  learningUnits.forEach(unit => {
    const row = tbody.insertRow();
    row.innerHTML = `
      <td>${unit.name}</td>
      <td>${unit.status}</td>
      <td>${unit.course}</td>
      <td><button onclick="editUnit(${unit.id})">编辑</button>  <button onclick="viewUnitProgress(${unit.id})">查看进度</button></td>
    `;
  });
}

// 加载学生进度数据
function loadStudentProgressData() {
  fetch(`${apiUrl}/records`, {  // 获取学生进度数据
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({
      pageNum: 1,
      pageSize: 10
    })
  })
  .then(response => response.json())
  .then(data => {
    if (data.code === 200) {
      renderStudentProgressData(data.data.records);  // 渲染学生进度数据
    } else {
      alert('加载学生进度数据失败');
    }
  })
  .catch(error => {
    console.error('Error fetching student progress data:', error);
    alert('加载学生进度数据失败');
  });
}

// 渲染学生进度数据到表格
function renderStudentProgressData(studentProgress) {
  const tbody = document.getElementById('student-progress-table').getElementsByTagName('tbody')[0];
  tbody.innerHTML = '';  // 清空表格内容
  studentProgress.forEach(student => {
    const row = tbody.insertRow();
    row.innerHTML = `
      <td>${student.name}</td>
      <td>${student.unit}</td>
      <td>${student.progress}</td>
      <td>${student.score}</td>
      <td><button onclick="viewStudentProgress(${student.id})">查看</button></td>
    `;
  });
}

// 编辑教学班信息
function editClass(classId) {
  const modal = document.getElementById('edit-class-modal');
  modal.style.display = "block";

  // 假设从后端获取教学班信息
  fetch(`${apiUrl}/${classId}`)
    .then(response => response.json())
    .then(data => {
      if (data.code === 200) {
        const classData = data.data;
        document.getElementById('class-name').value = classData.name;
        document.getElementById('class-description').value = classData.description;

        // 处理保存按钮事件
        document.getElementById('edit-class-form').onsubmit = function (event) {
          event.preventDefault();
          const updatedClassName = document.getElementById('class-name').value;
          const updatedClassDescription = document.getElementById('class-description').value;
          // 调用API更新数据
          alert(`已更新教学班：${updatedClassName}，描述：${updatedClassDescription}`);
          modal.style.display = "none";  // 关闭弹框
        };
      }
    })
    .catch(error => {
      console.error('Error fetching class data:', error);
      alert('加载教学班数据失败');
    });
}

// 关闭编辑教学班弹框
function closeEditClassModal() {
  document.getElementById('edit-class-modal').style.display = "none";
}

// 查看教学班活动
function viewClassActivities(classId) {
  alert(`查看教学班活动 ID: ${classId}`);
  window.location.href = `class-activities.html?classId=${classId}`;
}

// 管理教学班学生
function manageClassStudents(classId) {
  alert(`管理教学班学生 ID: ${classId}`);
  window.location.href = `class-students.html?classId=${classId}`;
}

// 编辑学习单元
function editUnit(unitId) {
  alert(`编辑学习单元 ID: ${unitId}`);
  window.location.href = `edit-unit.html?unitId=${unitId}`;
}

// 查看学习单元进度
function viewUnitProgress(unitId) {
  alert(`查看学习单元进度 ID: ${unitId}`);
  window.location.href = `unit-progress.html?unitId=${unitId}`;
}

// 查看学生学习进度
function viewStudentProgress(studentId) {
  alert(`查看学生学习进度 ID: ${studentId}`);
  window.location.href = `student-progress.html?studentId=${studentId}`;
}

// 退出功能
function logout() {
  // 清理本地存储和重定向到登录页面
  window.location.href = "../login.html";
}
